<template>
  <h1>猜数字练习</h1>
  <input type="text" placeholder="请输入你猜的数字" v-model="num">
  <button @click="guess()">猜一猜</button>
  <h3>小提示{{hint}}</h3>
  <h3>{{result}}</h3>

</template>


<script setup>
import {ref} from "vue";

const num = ref();
const result = ref("");
const hint = ref('');
//生成一个随机数
// const r= parseInt(Math.random()*100)+1;
let r= parseInt(Math.random()*100)+1;
console.log(r);

  // 统计次数
  // let count = 0;
  const count = ref(0);

const guess = ()=>{
  //判断输入内容是否是数字
  if (isNaN(num.value)){
    alert('请输入数字');
    return;
  }

  // count++;
  count.value++;
  if (num.value>r){
    result.value="猜大了";
  }else if (num.value<r) {
    result.value="猜小了";
  }else {
    // result.value="恭喜你用了"+count+"猜对了";
    result.value="恭喜你用了"+count.value+"猜对了";
  }
  // 清空数据
  num.value='';

}
</script>



<style scoped>

</style>